require("../../assets/font_44fp3ls0tzq/iconfont.css");
require("../../assets/css/reset.css");
require("../../assets/css/normalize.css");
require("../../assets/css/tabbar.less");
require("../../assets/css/sports.less");
require("./sports_drill.less");

const dom = require("../../utils/dom.js");
const axios = require("../../utils/axios.js");

document.addEventListener("DOMContentLoaded", function () {
	//渲染底部导航
	dom.tabBar("sports_run");

	//渲染头部
	dom.navbar("sports_drill");

	//发送请求获取课程列表
	axios.get("/api/train/courseList").then((res) => {
		let imgUrl = res.data.data.shift();
		//渲染最新课程
		dom.get("#main-two img").src = axios.defaults.baseURL + imgUrl.imgurl;
		dom.get("#main-two strong").textContent = imgUrl.name;
		dom.get("#main-two span").textContent = imgUrl.desc;
		dom.get("#main-two a").href =
			"sports_drill_list.html?id=" + imgUrl.courseId;

		//渲染课程
		let courses = res.data.data;
		let html = "";
		courses.forEach((v) => {
			html += `
		<li>
			<a href="sports_drill_list.html?id=${v.courseId}" >
				<img src="${axios.defaults.baseURL + v.imgurl}" alt="" />
				<strong>${v.name}</strong>
				<span>${v.desc}</span>
			</a>
		</li>`;
		});
		dom.get("#main-there ul").innerHTML = html;
	});
});
